<template>
  <div class="grand-child">
    <h3>我是孙组件</h3>
    拿着爷爷的{{money}}零花钱，开爷爷的{{ car.brand }} 车出去兜风了
    <button @click="updateMoney(100)">取零花钱</button>
  </div>
</template>

<script setup lang="ts" name="GrandChild">
import { inject } from 'vue';


//这里还必须要默认值才行，不然界面都出不来
let {money,updateMoney,car} = inject('parentContext',{money:0,updateMoney:(param:number)=>{},car:{brand:'',price:0}})

// 也可以这样写
// let {money,updateMoney,car} = inject('parentContext',{money:0,updateMoney:(param:number)=>{}


 
</script>

<style scoped>
  .grand-child{
    background-color: orange;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 0 10px black;
  }
</style>